<template>
<div class="container__">
    <div class="imgrz">
        <img src="/static/images/1000.png" alt="" >
    </div>
    <div class="fansitem" v-for="(item, index) in fanslist" :key="index">
        <div class="left">
            <div class="img"><img :src="item.url" alt=""></div>
            <div class="info_">
                <span class="usrname">{{item.name}}</span>
                <span class="des">{{item.des}}</span>
            </div>
        </div>
        <div class="right">
          <div v-if="type==2">
              <div class="weiguanzhu"   @click="routeTo(item.type)">
                  <span>重新认证</span>
              </div>
          </div>
          <div v-else>
                <!-- <div class="yiguanzhu">已关注</div> -->
              <div class="weiguanzhu"   v-if="item.is_auth==0&&isAuth==0" @click="routeTo(item.type)">
                  <span>去认证</span>
              </div>
              <div v-if="item.is_auth==0&&isAuth!=0" class="garybtn">
                  <span>去认证</span>
              </div>
              <div class="yiguanzhu"   v-if="item.is_auth==1" @click="routeTo(item.type)">
                  <span>审核中</span>
              </div>
              <div v-if="item.is_auth==3" class="yiguanzhu"  @click="routeTo(item.type)">
                  <span>已认证</span>
              </div>
              <div class="yiguanzhu"   v-if="item.is_auth==2" @click="routeTo(item.type)">
                  <span>认证失败</span>
              </div>
          </div>
           
        </div>
    </div>
</div>
</template>
<script>
export default {
  data() {
    return {
      fanslist: [
        {
          name: "家长认证",
          des: "完善信息、上传证件照",
          url: this.$URL.imgurl + "/102.png",
          type: 1,
          is_auth: 0
        },
        {
          name: "教师认证",
          des: "成为良师益友、上传教师资格证",
          url: this.$URL.imgurl + "/104.png",
          type: 2,
          is_auth: 0
        },
        {
          name: "教育公司",
          des: "成为明星课堂机构、上传营业执照",
          type: 3,
          is_auth: 0,
          url: this.$URL.imgurl + "/103.png"
        },
        {
          name: "教育媒体",
          des: "认证教育媒体、上传营业执照",
          type: 4,
          is_auth: 0,
          url: this.$URL.imgurl + "/105.png"
        },
        {
          name: "其他认证",
          des: "认证其他身份，上传证明证件",
          type: 5,
          is_auth: 0,
          url: this.$URL.imgurl + "/106.png"
        },
        {
          name: "全日制全校",
          des: "认证全日制学校、上传介绍信",
          url: this.$URL.imgurl + "/101.png",
          type: 6,
          is_auth: 0
        }
      ],
      child: [],
      Role: "",
      img: this.$URL.imgurl,
      isAuth: "",
      type:""
    };
  },
  methods: {
    routeTo(type) {
        console.log(type)
        wx.redirectTo({
            url: '/pages/Authdetails/main?type=' + type
        })
    }
  },
  onLoad(options){
    if(options.type){
         this.type=options.type;
    }
     
  },
  created() {},
  onShow() {
    this.isAuth = wx.getStorageSync("user_info").is_auth;
    if(this.isAuth!=0){
       this.Role = parseInt(wx.getStorageSync("user_info").role)-1;
       this.fanslist[this.Role].is_auth = this.isAuth; 
    }
  },
  onUnload(){
     Object.assign(this.$data, this.$options.data())
  },
};
</script>

<style lang="scss">
.container__ {
  background-color: #fff;
  min-height: 100vh;
  font-size: 16px;
  // padding: 40px 15px;
  box-sizing: border-box;
  .imgrz {
    height: 188px;
    img {
      height: 100%;
      width: 100%;
    }
  }
  .fansitem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    // margin-bottom: 20px;
    padding: 25px 15px;
    border-bottom: 1px solid #ddd;
    .right {
      font-size: 14px;
      .yiguanzhu {
        display: flex;
        justify-content: center;
        align-items: center;
        background:rgba(234,247,255,1);
        border:1px solid rgba(70,183,255,1);
        border-radius:15px;
        width:70px;
        height:30px;
        color: #46b7ff;
      }
      .weiguanzhu {
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        width:70px;
        height:30px;
        background:rgba(70,183,255,1);
        border-radius:15px;
      }
      .garybtn{
        width:70px;
        height:30px;
        background:rgba(201,201,201,1);
        border-radius:15px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        
      }
    }
    .left {
      height: 40px;
      display: flex;
      justify-content: flex-start;
      .info_ {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        margin-left: 11px;
        .usrname {
          font-size: 15px;
          font-weight: bold;
          color: rgba(51, 51, 51, 1);
        }
        .des {
          font-size: 12px;
          font-weight: 500;
          color: rgba(102, 102, 102, 1);
        }
      }
      .img {
        height: 40px;
        width: 40px;
        border-radius: 50%;
        // border: 1px solid rgba(70, 183, 255, 1);
        position: relative;
        img {
          height: 40px;
          width: 40px;
          border-radius: 50%;
        }
      }
    }
  }
}
</style>
